<!doctype html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
        <meta name="renderer" content="webkit" />
	    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height">
        <title>新闻中心</title>
        <script src="./js/common/vue.js"></script>
        <script src="js/common/axios.min.js"></script>
        <script src="./js/common/vue-resource.js"></script>
        <link href="favicon.ico" rel="shortcut icon">
        <link rel="stylesheet" href="css/common/swiper.css">
        <link rel="stylesheet" href="css/common/base.css">
        <link rel="stylesheet" href="css/common/animation.css">
        <link rel="stylesheet" href="css/common/media.css">
        <link rel="stylesheet" href="css/common/main.css">
        <link rel="stylesheet" href="css/news.css">
    </head>
    <body>
        <div id="contn">
            
            <v-header></v-header>
            <v-main></v-main>
            <v-footer></v-footer>
        </div>

        <template id="vMain">
            <main>
                <div class="heading ready">
                    <img :src="nav.length?nav[curr].imagePath:''" class="obj-c">
                    <div class="ttl fill flex flex-justify-content">
                        <p class="eng delay-1"></p>
                        <p class="chn delay-2">{{nav.length?nav[curr].name:''}}</p>
                    </div>
                </div>
                <nav class="flex flex-justify-content">
                    <a :href="'news.html?id=' + item.id" v-for="(item,i) in showcase" :class='item.id == typeId?"active":""'>{{item.name}}</a>
                </nav>
                <div class="fluid">
                   <div class="list">
                       <div class="item ready flex" v-if="listData.list.length" v-for="(item,i) in listData.list">
                            <div class="pic">
                                <p class="mid"><img :src="item.imagePath" class="fc"></p>
                            </div>
                            <div class="txt">
                                <div class="inner hvc">
                                    <p class="title">{{item.title}}</p>
                                    <p class="date">{{item.date}}</p>
                                    <p class="des">{{item.description}}</p>
                                    <a :href="'newsInfo.html?id=' + item.id" class="more">查看详情>></a>          
                                </div>
                            </div>
                       </div>
                   </div>
                   <div class="pages flex flex-align-items flex-justify-content">
                        <a v-if="listData.size && !listData.isFirstPage" href="javascript:;" class="prev pn hbc">
                            <img src="img/news/prev.png" alt="">
                            <img src="img/news/prev_c.png" alt="">
                        </a>
                        <a v-if="listData.size" href="javascript:;" :class="[index == listData.pageNum?'active':'']" v-for="index of listData.pages">{{index}}</a>
                        <a v-if="listData.size && !listData.isLastPage" href="javascript:;" class="next pn hbc">
                            <img src="img/news/next.png" alt="">
                            <img src="img/news/next_c.png" alt="">
                        </a>
                    </div>
                </div>
            </main>
        </template>
        
        <script src="js/common/swiper.js"></script>
        <script src="js/common/jquery.js"></script>
        <script src="js/common/dataUrl.js"></script>
        <script src="js/common/header.js"></script>
        <script src="js/common/footer.js"></script>
        <script>
            var typeId; 
            if(window.location.href.indexOf('id') >= 0){
                typeId = GetQueryString('id');
            }else{
                typeId = 60
            }
            console
            var page;
            if(window.location.href.indexOf('page') >= 0){
                page = GetQueryString('page');
            }else{
                page = 1;
            }

            var contn = new Vue({
                el:'#contn',
                data:{
                    
                },
                methods:{

                },
                components:{
                    vMain:{
                        template: '#vMain',
                        data:function(){
                            return{
                                nav:[],
                                curr:'',
                                showcase:[],
                                listData:{},
                                typeId:typeId
                            }
                        },
                        created:function(){
                            this.writingWeb();
                        },
                        mounted:function(){
                            ifMounted = true;
                        },
                        methods:{
                            writingWeb:function(){
                                //获取导航栏
                                axios.get(dataUrl + 'api/getNavbar',{
                                    headers:{
                                        Authorization: headers
                                    }
                                })
                                .then((res) => {
                                    //console.log(res.data.data);
                                    this.nav = res.data.data;
                                    var nowHref = window.location.href;
                                    for(var c = 1;c < res.data.data.length;c++){
                                        if(nowHref.indexOf(res.data.data[c].visitUrl) >= 0 && res.data.data[c].visitUrl.length){
                                            this.curr = c;
                                            console.log(c);
                                            //获取二级栏目详情
                                            axios.post(dataUrl + 'api/getNavbarDetails',{id:res.data.data[c].id},{
                                                headers:{
                                                    Authorization: headers
                                                }
                                            })
                                            .then((res) => {
                                                //console.log(res.data.data);
                                                this.showcase = res.data.data;
                                            })
                                            break;
                                        }
                                    }
                                    var This = this;
                                    setTimeout(function(){
                                        var enAry = This.nav[This.curr].enName.split(' ');
                                        for(var t = 0;t < enAry.length;t++){
                                            var txt = enAry[t];
                                            var fstLtr = txt[0];
                                            txt = txt.substring(1);
                                            //console.log(txt);
                                            var em = '<em>' + fstLtr + '</em>' + txt;
                                            var span = $('<span></span>').html(em);
                                            if(t){
                                                $('.heading .ttl .eng').append(' ');
                                            }
                                            $('.heading .ttl .eng').append(span);
                                        }
                                    },10)
                                });

                                //news
                                axios.post(dataUrl + 'api/v2/getArchivesDetails',{ext06:0,id:typeId,size:6,page:page},{
                                    headers:{
                                        Authorization: headers
                                    }
                                })
                                .then((res) => {
                                    console.log(res.data.data);
                                    for(var d = 0;d < res.data.data.list.length;d++){
                                        var date = res.data.data.list[d].createTime.split(' ')[0].split('-').join('.');
                                        res.data.data.list[d].date = date;
                                    }
                                    this.listData = res.data.data;
                                    var This = this;
                                    setTimeout(function(){
                                        $('main .pages a').click(function(){
                                            if($(this)[0].className.indexOf('pn') >= 0) {
                                                if($(this)[0].className.indexOf('prev') >= 0){
                                                    window.location.href = ('news.html?type=' + typeId + '&page=' + (This.listData.pageNum - 1));
                                                }else{
                                                    window.location.href = ('news.html?type=' + typeId + '&page=' + (This.listData.pageNum + 1));
                                                }
                                            }else{
                                                window.location.href = ('news.html?type=' + typeId + '&page=' + $(this).text());
                                            }
                                        })
                                    },10)
                                })
                            }
                        }
                    }
                }
            })
        </script>
        <script src="js/common/common.js"></script>
        <script src="js/common/animation.js"></script>
        <script src="js/index.js"></script>
    </body>
</html>
